import { useAuthStore } from '../store/auth'

/**
 * 权限指令
 * 使用方法：
 * v-permission="'user:create'" 单个权限
 * v-permission="['user:create', 'user:update']" 多个权限（或关系）
 * v-permission:all="['user:create', 'user:update']" 多个权限（与关系）
 */
export const permission = {
  mounted(el, binding) {
    checkPermission(el, binding)
  },
  updated(el, binding) {
    checkPermission(el, binding)
  }
}

/**
 * 角色指令
 * 使用方法：
 * v-role="'admin'" 单个角色
 * v-role="['admin', 'editor']" 多个角色
 */
export const role = {
  mounted(el, binding) {
    checkRole(el, binding)
  },
  updated(el, binding) {
    checkRole(el, binding)
  }
}

function checkPermission(el, binding) {
  const { value, modifiers } = binding
  const authStore = useAuthStore()
  
  if (!value) {
    return
  }
  
  let hasPermission = false
  
  if (Array.isArray(value)) {
    if (modifiers.all) {
      // 与关系：需要拥有所有权限
      hasPermission = value.every(permission => authStore.hasPermission(permission))
    } else {
      // 或关系：拥有任意一个权限即可
      hasPermission = value.some(permission => authStore.hasPermission(permission))
    }
  } else {
    hasPermission = authStore.hasPermission(value)
  }
  
  if (!hasPermission) {
    // 移除元素
    el.parentNode && el.parentNode.removeChild(el)
  }
}

function checkRole(el, binding) {
  const { value } = binding
  const authStore = useAuthStore()
  
  if (!value) {
    return
  }
  
  let hasRole = false
  
  if (Array.isArray(value)) {
    hasRole = value.includes(authStore.userRole)
  } else {
    hasRole = authStore.hasRole(value)
  }
  
  if (!hasRole) {
    // 移除元素
    el.parentNode && el.parentNode.removeChild(el)
  }
}

// 注册所有权限指令
export function setupPermissionDirectives(app) {
  app.directive('permission', permission)
  app.directive('role', role)
}